import Vue from 'vue'

import VueRouter from 'vue-router'

import Movie from '../views/Movie.vue'
// import Theater from '../views/Theater.vue'

import Intheater from '../views/Intheater.vue'
// import ComingSoon from ''../views/ComingSoon.vue''
// import ComingSoon2 from '../views/ComingSoon2.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: '/movie'
  },
  {
    path: '/movie',
    component: Movie,
    redirect: '/movie/intheater',
    name: 'movie',
    children: [
      {
        path: 'intheater',
        component: Intheater,
        alias: '/x',
        name: 'intheater',
        meta: {dir: 'left'},
      },
      {
        path: 'comingsoon',
        name: 'comingsoon',
        components: {
          default: () => import(/* webpackChunkName: "comingsoon" */ '../views/ComingSoon.vue'),
          cs2: () => import('../views/ComingSoon2.vue')
        }
      }
    ]
  },
  {
    path: '/theater',
    redirect: '/theater/12'
  },
  {
    path: '/theater/:id',
    component: () => import('../views/Theater.vue'),
    name: 'theater',
    beforeEnter(to, from, next) {
      next()
    }
  }
]

const router = new VueRouter({
  mode: 'history',
  routes
})


export default router